<template>
	<view class="page bgff py16 px40 login cbf">
		<view class="aliC mt40">
			<image class="r4 w84" src="/static/logo.jpg" mode="aspectFill"></image>
		</view>
		<view class="flex flexC pb12 pt40  borb">
			<image class="w32" src="/static/img/icon/phone.png" mode="widthFix"></image>
			<input v-model="mobile" class="flex1 pl12" type="number" placeholder="请输入您的手机号">
		</view>
		<view class="flex flexC pb12 pt20 borb">
			<image class="w32" src="/static/img/icon/pwd.png" mode="widthFix"></image>
			<input v-model="password" class="flex1 pl12" type="password" placeholder="请输入新密码">
		</view>
		<view class="flex flexC pb12 pt20 borb">
			<image class="w32" src="/static/img/icon/code.png" mode="widthFix"></image>
			<input v-model="code" class="flex1 pl12" type="number" placeholder="请输入4位数的验证码">
			<text v-if="times == 60" @click="getCode" class="cf2 mr10">发送验证码</text>
			<text v-else class="c99 mr10">{{times}}s后重新发送</text>
		</view>
	
		
		<button @click="reset" hover-class="none" class="bg41 r40 mt40 btn">重置密码</button>
		
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				times: 60,
				ref_mobile:'',
				mobile:'',
				password:'',
				code:''
			};
		},
		onLoad(option) {
			
			var platform = uni.getSystemInfoSync().platform;
		
		
		
		},
		methods: {
			
			reset(){
				let that = this;
				let param = {
					mobile: this.mobile,
					password:this.password,
					code:this.code,
				};
				if (this.mobile == '') {
				
					uni.showToast({
						title: "请输入手机号",
						icon: 'none'
					});
					return;
				}
				if (this.password == '') {
				
					uni.showToast({
						title: "请输入密码",
						icon: 'none'
					});
					return;
				}
				
				if (this.code == '') {
				
					uni.showToast({
						title: "请输入验证码",
						icon: 'none'
					});
					return;
				}
		
				
				this.$api.resetPwd(param).then(res => {
				
					if (res.code == 1) {
						uni.showToast({
							title: '重置成功',
							icon: 'none'
						});
						uni.navigateBack({
							delta:1
						})
					
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						});
					}
				
				})
			},
			
			getCode(){
				
				
				let that = this;
				let param = {
					mobile: this.mobile,
				};
				if (this.mobile == '') {
				
					uni.showToast({
						title: "请输入手机号",
						icon: 'none'
					});
					return;
				}
				
				this.$api.getCode(param).then(res => {
				
					if (res.code == 1) {
						that.countDown();
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						});
					}
				
				})
			},
			
			countDown() {
				let timer = setInterval(() => {
					if(this.times <= 0) {
						this.times = 60;
						clearInterval(timer);
					}else {
						this.times --;
					}
				},1000)
			}
		}
	}
</script>

<style lang="scss" scoped>
.login {
	.btn {
		line-height: 80rpx;
	}
	.w84 {
		width: 208rpx;
		height: 208rpx;
		border-radius: 60rpx;
	}
	.w20 {width: 40rpx;}
	.w32 {width: 64rpx;}
	.mt180 {margin-top: 200rpx;}
}
</style>
